<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>VideoRAG</title>
    <meta
      http-equiv="Content-Security-Policy"
      content="default-src 'self'; script-src 'self' 'unsafe-inline'; style-src 'self' 'unsafe-inline' 'https://fonts.googleapis.com'; font-src 'self' 'https://fonts.gstatic.com';"
    />
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
    <style>
      body {
        margin: 0;
        font-family: 'Inter', 'Roboto', 'Noto Sans', 'Helvetica Neue', Arial, sans-serif;
        background-color: #f5f5f5;
      }
      
      .loading {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100vh;
        font-size: 18px;
        color: #666;
      }
    </style>
  </head>
  <body>
    <div id="root">
      <div class="loading">Loading VideoRAG...</div>
    </div>
    <script type="module" src="./src/main.tsx"></script>
  </body>
</html> 